import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';


class Test8 extends StatefulWidget{
    _TestState createState() => _TestState();
}

class _TestState extends State<Test8> {

    final GlobalKey<AnimatedListState> _listKey = new GlobalKey<AnimatedListState>();
    List<int> _list = [0,1];
    int _selectedIndex;

    void _insert(){
        final int insertValue =_list[_list.length-1]+1;
        final int insertIndex = _list.length;
        setState(() {
            _list.insert(_list.length,insertValue);
            _listKey.currentState.insertItem(insertIndex);
        });
        
    }

    void _remove(){
        if(_selectedIndex != null){
            _list.removeAt(_selectedIndex);
            setState(() {
                _listKey.currentState.removeItem(_selectedIndex,(BuildContext context,Animation<double> animation){
                    return Container();
                });
                _selectedIndex = null;
            });
        }
    }

    @override
    Widget build(BuildContext context) {

        return new Scaffold(
            appBar: AppBar(
                title: Text("AnimatedList"),
                centerTitle: true,
                actions: <Widget>[
                    IconButton(
                        icon: Icon(Icons.add_circle),
                        onPressed: _insert,
                    ),
                    IconButton(
                        icon: Icon(Icons.remove_circle),
                        onPressed: _remove,
                    )
                ],
            ),
            body: Padding(
                padding: EdgeInsets.all(16.0),
                child: AnimatedList(
                    key: _listKey,
                    initialItemCount: _list.length,
                    itemBuilder:(BuildContext context,int index,Animation<double> animation){
                        return SizeTransition(
                            axis: Axis.vertical,
                            sizeFactor: animation,
                            child: GestureDetector(
                                behavior: HitTestBehavior.opaque,
                                onTap:(){
                                    setState(() {
                                        _selectedIndex = index;
                                    });
                                },
                                child: new SizedBox(
                                    height: 128.0,
                                    child: Card(
                                        color: Colors.primaries[index % Colors.primaries.length],
                                        child: Center(
                                            child: Text(
                                                "item ${_list[index]}",
                                                style: TextStyle(
                                                    color: _selectedIndex==index?Colors.lightGreenAccent[400]:Colors.black
                                                ),
                                            ),
                                        ),
                                    ),
                                ),
                            ),
                        );
                    },
                ),
            )
        );
    }
}
